<template>
 <div>
   <!-- 导航栏 -->
    <div class="my_nav">
      <ul class="nav_left">
        <li>当当美食</li>
        <li><el-link href="/"   type="info">首页</el-link> </li>
        <li><el-link href="/login" target="_blank"  type="info">菜单</el-link></li>
        <li><el-link href="/login" target="_blank"  type="info">食材</el-link></li>
        <li><el-link href="/login" target="_blank"  type="info">珍品</el-link></li>
        <li><el-link href="/login" target="_blank"  type="info">健康</el-link></li>
        <li><el-link href="/login" target="_blank"  type="info">话题</el-link></li>
        <li><el-link href="/login" target="_blank"  type="info">活动</el-link></li>
      </ul>
      <ul class="nav_right">
        <li v-if="!$store.state.token"><router-link to="/my_login" target="_blank" >登录</router-link> </li>
        <li v-if="!$store.state.token"><router-link to="/my_register" target="_blank"  >注册</router-link> </li>
        <li v-if="$store.state.token" @click="logout">注销</li>
        <li
          style="
            display: flex;
            flex-direction: column;
            align-items: center;
            font-size: 14px;
          "
        >
          <img
            src="../assets/img/QQ.png"
            width="18px"
            height="18px"
            style="margin-bottom: -10px"
          />
          QQ登录
        </li>
        <li>签到</li>
        <li>送礼</li>
      </ul>
    </div>
   
   </div>  


</template>

<script>
export default{
    methods:{
      logout(){   
        localStorage.clear();
         this.$store.commit('update',false);
      }
    }
}
</script>

<style>

</style>
